<template>
   <div>
      <!--头部顶部-->
      <header-top></header-top>
      <!--导航-->
      <header-nav></header-nav>
      <!--主体内容-->
      <div class="body-content">
         <!--轮播图 + 右边导航-->
         <div class="swiper-right-nav">
            <swiper></swiper>
            <right-nav></right-nav>
            <section-box-bav></section-box-bav>
         </div>
         <!--主体内容-->
         <div class="body-content-box">
            <!--热卖商品 组件-->
            <section-hotsale-box></section-hotsale-box>
            <!--手机-->
            <index-phone-center></index-phone-center>
            <!--智能配件-->
            <index-accessory-center></index-accessory-center>
         </div>
      </div>
      <!--底部导航-->
      <meizu-footer-wrap></meizu-footer-wrap>
      <srcollTo></srcollTo>
   </div>
</template>

<script>
   import HeaderTop from '../../components/Header-Top/Header-Top'
   import swiper from '../../components/swiper/swiper'
   import HeaderNav from '../../base/header-nav/header-nav'
   import rightNav from '../../base/right-nav/right-nav'
   import sectionBoxBav from '../../base/section-box-nav/section-box-nav'
   import sectionHotsaleBox from '../../base/section-hotsale-box/section-hotsale-box'
   import indexPhoneCenter from '../../base/index-phone-center/index-phone-center'
   import indexAccessoryCenter from '../../base/index-accessory-center/index-accessory-center'
   import meizuFooterWrap from '../../base/meizu-footer-wrap/meizu-footer-wrap'
   import {mapMutations} from 'vuex'
   export default {
      name: 'home_page',
      mounted() {
          this.setNavigationField('')
      },
      methods: {
         ...mapMutations({
            setNavigationField: 'navigationField'
         })
      },
      components: {
         HeaderTop,
         swiper,
         HeaderNav,
         rightNav,
         sectionBoxBav,
         sectionHotsaleBox,
         indexPhoneCenter,
         indexAccessoryCenter,
         meizuFooterWrap
      }
   }
</script>

<style scoped lang="stylus">
   .body-content
      width 1240px
      height auto
      margin 0 auto

   .swiper-right-nav
      position relative

   .body-content-box
      margin-top 60px
</style>
